<template>
  <div class="personnel-table">
    <span>家庭成员列表</span>
    <div class="table">
      <vxe-table :data="personnelData" border highlight-hover-row>
        <!-- 展开列 -->
        <vxe-table-column field="name" title="姓名" width="100" />
        <vxe-table-column field="sex" title="性别" width="70" />
        <vxe-table-column field="age" title="年龄" width="70" />
        <vxe-table-column field="birthday" title="出生日期" width="100" />
        <vxe-table-column field="archives" title="健康档案号" width="180" />
        <vxe-table-column field="cardId" title="身份证号" width="180" />
        <vxe-table-column field="relation" title="与户主关系" width="100" />
      </vxe-table>
    </div>
  </div>
</template>

<script>
export default {
  props: ['personnelData'],
  data() {
    return {

    }
  }
}
</script>
<style lang="scss" scoped>
  .personnel-table {
    width: 300px;
    display: flex;
    flex-direction: column;
    height: 100%;
    .table {
      flex: 1;
      height: 100%;
    }
  }
</style>
